﻿<%@ Page Language="C#" AutoEventWireup="true" MasterPageFile="~/masterpage/Main.Master" CodeBehind="contactus.aspx.cs" Inherits="SmartyParty.contactus" %>

<asp:Content ContentPlaceHolderID="ContentPlaceHolder1" ID="content1" runat="server">
<script type="text/javascript" language="javascript">
    $(document).ready(function () {

        function ValidateForm() {
            var valid = true;
            if ($('#txtName').val() == '') {
                $('#spName').removeAttr('display');
                valid = false;
            }
            else {
                 $('#spName').attr('style','display:none');
                valid = true;
            }
            
            if ($('#txtSurname').val() == '') {
                $('#spSurname').attr('display','');
                valid = false;
            }
            else {
                 $('#spSurname').attr('display','none');
                valid = true;
            }

            if ($('#txtMobile').val() == '') {
                $('#spMobile').attr('display','');
                valid = false;
            }
            else {
                 $('#spMobile').attr('display','none');
                valid = true;
            }

            if ($('#txtEmail').val() == '') {
                $('#spEmail').attr('display','');
                valid = false;
            }
            else if ($('#txtEmail').val().indexOf("@") >= 0) {
                $('#spEmail').attr('display','none');
                valid = true;
            }
            else {
                valid = false;
                alert('Please enter valid email address.');
            }
            
            return valid;
        }

        $('#btnSubmit').click(function () {            
            if (!ValidateForm())
                return alert('Please complete mandatory fields!');

            var mail = SetFieldValues();

            $.ajax({
                type: "POST",
                data: mail,
                url: "sendmail.aspx?mail=" + mail,
                dataType: "html",
                success: function (result) {
                    $(".mail").html(result);
                }
            });

            function SetFieldValues() {
                var name = $('#txtName').val();
                var surname = $('#txtSurname').val();
                var mobile = $('#txtMobile').val();
                var tel = $('#txtTel').val();
                var fax = $('#txtFax').val();
                var email = $('#txtEmail').val();
                var subject = $('#txtSubject').val();
                var comments = $('#txtComments').val();
                var mail = ["name|" + name, "surname|" + surname, "mobile|" + mobile, "Tel|" + tel, "Fax|" + fax, "Email|" + email, "Comments|" + comments, "Subject|" + subject];
                return mail.join(",");
            }


        });

        $('#btnClear').click(function () {
            $('#txtName').val('');
            $('#txtSurname').val('');
            $('#txtMobile').val('');
            $('#txtTel').val('');
            $('#txtFax').val('');
            $('#txtEmail').val('');
            $('#txtSubject').val('');
            $('#txtComments').val('');
        });
    });
</script>

<div class="mail" style="margin-left:auto;margin-right:auto;width:500px;height:600px;padding-left: 250px;font-family: 'Buxton Sketch'"><span style="font-size: 14pt;font-weight: bold;font-family: 'Buxton Sketch'">Any queries?</span><br /><br />
        <div id="errMsg" runat="server" visible="false"></div>
        <div id="firstName"><div style="width:200px"><span style="color:red; ">*</span>Name:</div> <input type="text" id="txtName" style="width: 200px" /><span id="spName" style="display: none;color: red;font-weight: bold">&nbsp;Please enter your name!</span></div><br />
        <div id="surname"><div style="width:200px"><span style="color:red; ">*</span>Surname:</div><input type="text" id="txtSurname" style="width: 200px" /><span id="spSurname" style="display: none;color: red;font-weight: bold">&nbsp;Please enter your surname!</span></div><br />
        <div id="mobile"><div style="width:200px"><span style="color:red; ">*</span>Mobile:</div><input type="text" id="txtMobile" style="width: 200px" /><span id="spMobile" style="display: none;color: red;font-weight: bold">&nbsp;Please enter your mobile number!</span></div><br />
        <div id="tel"><div style="width:200px">Tel:</div><input type="text" id="txtTel" style="width: 200px" /></div><br />
        <div id="fax"><div style="width:200px">Fax:</div><input type="text" id="txtFax" style="width: 200px" /></div><br />
        <div id="email"><div style="width:200px"><span style="color:red; ">*</span>Email: </div><input type="text" id="txtEmail" class="required email" style="width: 200px" /><span id="spEmail" style="display: none;color: red;font-weight: bold">&nbsp;Please enter your email!</span></div><br />
        <div id="subject"><div style="width:200px">Subject: </div><input type="text" id="txtSubject" style="width: 200px" /><span id="spSubject" style="display: none;color: red;font-weight: bold">&nbsp;Please enter a subject!</span></div><br />
        <div id="comment">
            <div style="width:200px">Commments:</div>
                <textarea  id="txtComments" rows="4" cols="1" style="width: 300px"></textarea><span id="spComments" style="display: none;color: red;font-weight: bold">&nbsp;Please enter your comment!</span><br />
            <input type="button" id="btnSubmit" style="background-image: url('images/submit.gif');width: 67px;height:30px ; cursor: pointer;border-style: none" />&nbsp;<input type="button" id="btnClear" style="background-image: url('images/clear.gif');width: 67px;height: 30px; cursor: pointer;border-style: none;" />
        </div>
    </div>
</asp:Content>
